<template>
    <div class="myaccount">
        <div class="tt">
            个人资料
        </div>
        <div class="info">
            <div class="avatarUrl">
                <p>头像</p>
                <div class="imgs">
                    <UploadImgs></UploadImgs>
                </div>
            </div>
            <div class="nickname">
                <p>昵称</p>
                <el-input v-model="nickname" class="w50" placeholder="请输入内容" style="width: 300px;"
                          @blur="UpdateNickname"></el-input>
            </div>
            <div class="nickname">
                <p>手机</p>
                <el-input v-model="tel" class="w50" placeholder="请输入内容" style="width: 300px;"
                          @blur="UpdateTel"></el-input>
            </div>
        </div>
        <div class="tt" style="margin-top: 20px;">账号绑定</div>

        <div class="updateinfo">
            <div class="fs-mim">
                <div>账号</div>
                <el-input v-model="tel" style="width: 86%;"></el-input>
            </div>
            <div class="fs-mim">
                <div>验证码</div>
                <el-input v-model="code" style="width: 60%;margin-right: 10px;"></el-input>
                <el-button v-show="show" @click="getCode">获取验证码</el-button>
                <el-button v-show="!show" disabled type="info">{{ count }} 秒</el-button>
            </div>
            <div slot="footer"
                 class="">
                <el-button type="primary"
                           @click="UpdateUsername()">确 定
                </el-button>
            </div>
        </div>
    </div>
</template>


<script setup>
/**
 * 组件引入
 */
import {onMounted, reactive, ref, computed} from 'vue'
import http from "../../api/api.js"
import msg from "../../utils/Message.js"
import UploadImgs from "../../components/UploadImgs.vue"
import Cookies from "js-cookie";

/**
 * 全局变量
 * @type {UnwrapNestedRefs<{count: string, list: *[]}>}
 */

var show = ref(true)

var user = ref({
    avatarUrl: "https://www.xiaouhegongyi.cn//uploads/20230807/5af965b0ff70838168b7e7c136fe795a.jpeg",
    nickname: "哦"
})


/**
 * 页面挂载后
 */
onMounted(() => {
    isLogin()
});

/**
 * 计算属性
 */

/**
 * 方法区
 */


// 是否登录
const isLogin = () => {
    const token = Cookies.get("token")
    if (!token) {
        msg.message("您未登录，请登录", 'error')
    }
}

</script>

<style lang="scss" scoped>
@import '../../assets/scss/index.scss';
</style>

